<template>
  <div>
    <h3>这个是Father组件---sync--{{ num }}---{{ num2 }}</h3>
    <!-- <Son :value="num" @input="(val)=> num = val" /> -->
    <!-- v-model: 表单数据的双向绑定，也可以绑定在组件上，进行数据的双向修改 -->
    <!-- v-model是一个语法糖的写法相当于 <Son :value="num" @input="(val)=> num = val" />
      注意： v-model在同一个组件身上只能绑定一次
    -->
    <!-- :变量名.sync="传入的值"  作用是可以在组件上实现数据的双向绑定，可以绑定多次
    这个也是语法糖的写法，等同于
    <Son :a="num" :b="num2" @update:a="val=> num=val" @update:b="val=> num2=val" />

    -->

    <Son :a.sync="num" :b.sync="num2" />
  </div>

</template>
<script>
import Son from './Son.vue'
export default {
  components: {
    Son
  },
  data() {
    return {
      num: 100,
      num2: 200
    }
  },
  methods: {
    hClick() {
      alert('ok')
    }
  }
}

</script>
